<template>
	<view>
		<u-popup v-model="completeOpen" mode="bottom" safe-area-inset-bottom closeable>
			<view class="popup-body">
				<view class="popup-title">审批</view>
				<view class="popup-textarea">
					<u-input
						:clearable="false"
						:custom-style="customStyle"
						v-model="taskForm.comment"
						type="textarea"
						height="260"
						placeholder="请输入意见"
						:cursor-spacing="150"
					/>
				</view>
				<view class="popup-btn">
					<u-button @click="taskComplete" type="primary">提交</u-button>
				</view>
			</view>
		</u-popup>

		<u-popup v-model="rejectOpen" mode="bottom" safe-area-inset-bottom closeable>
			<view class="popup-body">
				<view class="popup-title">拒绝</view>
				<view class="popup-textarea">
					<u-input
						:clearable="false"
						:custom-style="customStyle"
						v-model="taskForm.comment"
						type="textarea"
						height="260"
						placeholder="请输入拒绝意见"
						:cursor-spacing="150"
					/>
				</view>
				<view class="popup-btn">
					<u-button @click="taskReject" type="primary">提交</u-button>
				</view>
			</view>
		</u-popup>

		<u-popup v-model="returnOpen" mode="bottom" safe-area-inset-bottom closeable>
			<view class="popup-body">
				<view class="popup-title">退回节点</view>
				<view class="popup-radio">
					<u-radio-group wrap v-model="taskForm.targetKey">
						<u-radio v-for="item in returnTaskList" :key="item.taskDefinitionKey"
							:name="item.taskDefinitionKey">
							{{item.name}}
						</u-radio>
					</u-radio-group>
				</view>
				<view class="popup-title">退回</view>
				<view class="popup-textarea">
					<u-input
						:clearable="false"
						:custom-style="customStyle"
						v-model="taskForm.comment"
						type="textarea"
						height="260"
						placeholder="请输入退回意见"
						:cursor-spacing="150"
					/>
				</view>
				<view class="popup-btn">
					<u-button @click="taskReturn" type="primary">提交</u-button>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	export default {
		name: "operate",
		props: {
			taskForm: {}
		},
		data() {
			return {
				returnOpen: false,
				rejectOpen: false,
				completeOpen: false,
				returnTaskList: [],
				customStyle: {
					fontSize: '30rpx',
					padding: '18rpx',
					background: 'rgba(216,216,216,0.3)',
					borderRadius: '9rpx'
				}
			}
		},
		methods: {
			handleComplete() {
				this.completeOpen = true
			},
			/** 可退回任务列表 */
			handleReturn() {
				this.returnOpen = true
				this.$u.api.workflow.returnList(this.taskForm).then(data => {
					this.returnTaskList = data
					if (data && data[0]) {
						this.taskForm.targetKey = data[0].taskDefinitionKey
					}
					this.taskForm.values = null
				})
			},
			handleReject() {
				this.rejectOpen = true
			},
			/** 驳回任务 */
			taskReject() {
				if (!this.taskForm.comment) {
					this.$u.toast('请输入审批意见');
					return
				}
				let data = {
					...this.taskForm,
				}
				this.$u.api.workflow.complete(data).then(response => {
					this.$u.toast('审批已拒绝');
					this.$emit('back')
				})
			},
			/** 提交退回任务 */
			taskReturn() {
				if (!this.taskForm.comment) {
					this.$u.toast('请输入审批意见');
					return
				}
				let data = {
					...this.taskForm,
				}
				this.$u.api.workflow.returnTask(data).then(response => {
					this.$u.toast('审批已退回');
					this.$emit('back')
				})
			},
			/** 审批任务 */
			taskComplete() {
				if (!this.taskForm.comment) {
					this.$u.toast('请输入审批意见');
					return
				}
				let data = {
					...this.taskForm,
				}
				this.$u.api.workflow.rejectTask(data).then(response => {
					this.$u.toast('审批通过');
					this.$emit('back')
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.popup-body {
		padding: 36.23rpx;
	}

	.popup-title {
		color: #3D3D3D;
		font-size: 32.61rpx;
	}

	.popup-textarea {
		margin-top: 36.23rpx;
	}
	.popup-btn{
		margin-top: 126.81rpx;
		padding: 0 36.23rpx;
	}

	.popup-radio{
		padding: 54.35rpx;
	}
</style>
